{%extends file="wap_user/page/layout.tpl"%}
{%block name="sub-head-static"%}
{%require name="wap_user:static/buydemand/buydemand.less"%}
{%require name="wap_user:static/buydemand/buydemand.js"%}
<script>
    P.data('data', {%json_encode($data)%});
</script>
{%/block%}

{%block name="body-container"%}
<div class='page-title'>购买活期</div>
<div class="page-buydemand">
    <div class="preview-block">
        <section class="buy-preview">
            <div class="block1">
                <div>
                    <span>账户可用余额：</span>
                    <span>￥{%$data.amount|format_amount:2%}</span>
                </div>
                <div class="buy-form">
                    <div class="form-line1">
                        <span class="left">
                            可购份额
                            <span class="icon"></span>
                        </span>
                        <span class="right">
                            ￥
                            {%if $data.available_amount<$data.plat_credit_buy%}
                            {%$data.available_amount|format_amount:0%}
                            {%else%}
                            {%$data.plat_credit_buy|format_amount:0%}
                            {%/if%}
                        </span>
                    </div>
                    <div class="clearfix"></div>
                    <div class="form-line2">
                        <span class="input">
                            <span class="dollar">￥</span>
                            <input type="text" class="amount" placeholder="请输入购买金额">
                        </span>
                    </div>
                </div>
            </div>
            {%if sizeof($data.coupon.list) > 0%}
            <div class="block2">
                <div class="title">使用红包</div>
                <ul>
                    {%foreach $data.coupon.list as $item %}
                    {%if $item.type == 1%}
                    <li>
                        <span class="icon"></span>
                        {%$item.amount|format_amount%}元红包
                        <span class="info">有效期至：{%$item.expire_time|date_format:'%Y-%m-%d'%}</span>
                    </li>
                    {%/if%}
                    {%/foreach%}
                </ul>
            </div>
            {%/if%}
            <div class="btn-block">
                <div class="btn btn-large btn-next btn-main">购买</div>
            </div>
        </section>
    </div>

    <div class="confirm-block">
        <div class="page-subtitle">确认您的订单</div>
        <div class="page-confirm">
            <section class="buy-preview">
                <div class="block1">
                    <ul>
                        <li>购买产品：真融宝活期</li>
                        <li>购买份额：<span class="buy-amount"></span></li>
                        <li class="coupon_info">使用红包：<span class="coupon_info_amount"></span>元 全场通用红包</li>
                    </ul>
                    <div class="actual_block">
                        <span>实际支付金额：</span>
                        <span class="amount">￥<span class="actual-amount"></span></span>
                    </div>
                </div>
                <div class="btn-block">
                    <div class="btn btn-large btn-main btn-purchasing">购买</div>
                </div>
            </section>
        </div>
    </div>
    <div class="loading-block">
        <div class="page-subtitle">订单处理中</div>
        <div class="loading-icon"></div>
        <div class="loading-info">
            您的订单已提交，系统正在紧张购买中…
        </div>
    </div>
    <div class="success-block">
        <div class='page-subtitle'>活期购买成功 确认您的订单</div>
        <div class="page-success">
            <section class="buy-preview">
                <div class="text-content">
                    您已成功购买了￥<span class="amount"></span>元的真融宝活期。若想确认，您可至“账户总览”内查看您的活期资产。
                </div>
                <div class="btn-block">
                    <div class="btn btn-large wallet-btn">查看账户总览</div>
                </div>
            </section>
        </div>
    </div>
    <div class="fail-block">
        <div class='page-subtitle'>系统交易异常</div>
        <div class="page-success">
            <section class="buy-preview">
                <div class="text-content">
                    对不起，系统出现异常，请拨打我们的热线电话(400-600-4869)了解详细原因
                </div>
                <div class="btn-block">
                    <div class="btn btn-large wallet-btn">跳转至账户总览</div>
                </div>
            </section>
        </div>
    </div>
    <div class="timeout-block">
        <div class='page-subtitle'>系统交易繁忙</div>
        <div class="page-success">
            <section class="buy-preview">
                <div class="text-content">
                    对不起，系统交易繁忙，请稍后在交易记录进行确认，如果有任何疑问，请拨打我们的热线电话(400-600-4869)了解详细原因。
                </div>
                <div class="btn-block">
                    <div class="btn btn-large trade-log-btn">查看交易记录</div>
                </div>
            </section>
        </div>
    </div>
</div>
{%/block%}